<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>

<body>
	<div style="height: 2000px;">
		<button id="btn">提交</button>
	</div>
</body>
<script src="">
	function debounce(fn, wait) {
		var timeout = null;
		return function () {
			if (timeout !== null)
				clearTimeout(timeout);
			timeout = setTimeout(fn, wait);
		}
	}
	// 处理函数
	function handle() {
		console.log(Math.random());
	}
	// 滚动事件
	window.addEventListener('scroll', debounce(handle, 1000));
</script>
<script src="">
	function throttled(fn, time = 2000) {
		let timer = null
		return function (...args) {
			if (!timer) {
				timer = setTimeout(() => {
					fn.apply(this, args)
					timer = null
				}, time);
			}
		}
	}
	function handle() {
		console.log('提交成功');
	}
	btn.addEventListener('click', throttled(handle))
</script>
<script>
	function throttled(fn, delay) {
		let oldTime = Date.now()
		return function (...args) {
			let newTime = Date.now()
			// 如果超过限定的时间，可以再次出发事件
			if (newTime - oldTime >= delay) {
				fn.apply(this, args)
				oldTime = Date.now()
			}
		}
	}


	function handle() {
		console.log(Math.random());
	}
	btn.addEventListener('click', throttled(handle, 1000))
</script>
<script src="">
	var throttle = function (func, delay) {
		var prev = Date.now();
		return function () {
			var context = this;
			var args = arguments;
			var now = Date.now();
			if (now - prev >= delay) {
				func.apply(context, args);
				prev = Date.now();
			}
		}
	}
	function handle() {
		console.log(Math.random());
	}
	btn.addEventListener('click', throttle(handle, 1000))
	window.addEventListener('scroll', throttle(handle, 1000));

</script>

</html>